<template>
	<view class="my-content">
		<view class="form-box">
			<text class="form-title">*名称</text>
			<view class="form-item">
				<input type="text" v-model="formData.title" placeholder="请输入名称" />
			</view>
		</view>

		<view class="form-box">
			<text class="form-title">数量</text>
			<view class="form-item">
				<input type="text" v-model="formData.number" placeholder="请输入数量" />
			</view>
		</view>
		
		<view class="form-box">
			<text class="form-title">成本价 (元)</text>
			<view class="form-item">
				<input type="text" v-model="formData.market_price" placeholder="请输入成本价" />
			</view>
		</view>

		<view class="form-box" >
			<view class="form-title1">
				<text>上传照片</text>
				<view class="card-box" @click="uploadImg">
					<image v-if="formData.logo" :src="imgDomain+formData.logo" style="width: 200rpx;height: 200rpx;"></image>
					<image v-else :src="imgDomain+'uploads/no_data.jpg'" style="width: 200rpx;height: 200rpx;"></image>
				</view>
			</view>
		</view>
		
		<button class="submit" @click="submit" style="margin-left: 0rpx;">保存</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			imgDomain:'https://xcx.yumeishangmao.com/',
			formData: {
				member_id:'',
				title: "", //
				number:"",
				market_price:"",
				logo:'',
				id:''
			},
			item:{},
		}
	},
	onLoad(options) {
		var member = uni.getStorageSync('member')
		if(member){
			this.formData.member_id = member.member_id
		}
		
		if(options.item){
			this.item = JSON.parse(options.item)
			if(this.item){
				this.formData.title = this.item.title
				this.formData.number = this.item.number
				this.formData.market_price = this.item.market_price
				this.formData.logo = this.item.logo
				this.formData.id = this.item.id
			}
		}
		
	},
	methods: {
		submit() {
			var that = this
			if (!uni.getStorageSync('memberInfo')) {
				uni.showToast({
					'title':'请先登录'
				})
				return
			}
			if (!this.formData.title) {
				uni.showToast({
					title:'请输入名称'
				})
				return;
			}
			if (!this.formData.number) {
				uni.showToast({
					title:'请输入数量'
				})
				return;
			}
			if (!this.formData.market_price) {
				uni.showToast({
					title:'请输入成本价'
				})
				return;
			}
			
			uni.showLoading({
				title: '加载中...',
				mask: true
			});
			
			that.$api.sendRequest({
				url: '/api/site/jinhuoSave', 
				data:{
					formData: JSON.stringify(that.formData)
				},
				success: res => {
					console.log(res)
				}
			})
			uni.showToast({
				title:'操作成功'
			})
			
			setTimeout(() => {
				uni.navigateBack();	
			}, 1500);
			
			
			uni.hideLoading();
		},
		uploadImg() {
			var that = this
			console.log('上传')
			uni.chooseImage({
				count: 1,
				success: (res) => {
					console.log(res)
					that.uploadImgSubmit(res.tempFilePaths[0])
				},fail(res) {
					console.log(res)
				}
			})
		},
		
		uploadImgSubmit(url) {
			var that = this
			uni.uploadFile({
				url: this.imgDomain+"/index/index/upload",
				filePath: url,
				name: 'file',
				success: (res) => {
					that.formData.logo = res.data
				}
			})
		}
	}
}
</script>

<style lang="less" scoped>
	.mask {
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: rgba(0, 0, 0, 0.5);
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 10;
	}
.my-content {
	width: 100%;
	padding: 30upx;
	box-sizing: border-box;

	.form-box {
		width: 100%;
		border-radius: 16upx;
		box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.3);
		margin-bottom: 20upx;
		padding: 30upx;
		box-sizing: border-box;

		.form-title {
			font-size: 32upx;
			color: #000;
			font-weight: 700;
			display: block;
		}

		.form-title1 {
			font-size: 32upx;
			color: #000;
			font-weight: 700;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.card-box {
			width: 50%;
			margin: 10upx auto;

			image {
				width: 100%;
			}
		}

		.switch-box {
			display: flex;
			align-items: center;

			image {
				width: 44upx;
				height: auto;
				display: block;
				margin-right: 10upx;
			}

			text {
				color: #A6A6A6;
				font-size: 28upx;
				font-weight: normal;

				&:last-of-type {
					color: #3662EC;
				}
			}
		}

		.form-item {
			margin: 20upx 0;
			font-size: 32upx;
			display: flex;
			align-items: center;

			.blue {
				color: #3662EC;
			}

			.font-num {
				color: #999;
				font-size: 28upx;
				text-align: right;
				display: block;
			}

			.picker-box {
				display: flex;
				align-items: center;
				margin-right: 10upx;

				image {
					width: 48upx;
					height: auto;
				}
			}

			input {
				width: 100%;
			}
		}
	}

	.submit {
		width: 100%;
		height: 80upx;
		border-radius: 16upx;
		background: #FF8F1F;
		box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.3);
		color: #fff;
		line-height: 80upx;
		font-size: 44upx;
		font-weight: 700;
		margin-top: 40upx;
	}
}
</style>